<!--
 * @Author: wuyue
 * @Date: 2023-03-01 16:56:12
 * @LastEditTime: 2023-03-27 11:49:57
 * @LastEditors: wuyue
 * @Descripttion: 业务代办确认表单
 * @version: 
-->
<template>
  <div>
    <a-card :bordered="false">
      <title-name title="处理"></title-name>
      <a-card :bordered="false">
        <title-name :title="confirmFormFormAttr.title"></title-name>
        <custom-form :is-emit="false" :formList="formList" :form="form" editModel="" :formComponents="$refs">
            <template slot="projectPlanName">
                  <a-input
                    v-model="form.projectPlanName"
                    disabled
                    class="chioseInput"
                    style="width: calc(100% - 70px)"
                    placeholder="请选择设所属配置计划"
                  />
                  <a-button :disabled="form.receiveState !== '1'" class="chioseBtn" type="primary" @click="chioseBtn">
                    选择
                  </a-button>
              </template>
        </custom-form>
      </a-card>
      <a-card v-if="confirmFormFormAttr.key" :bordered="false">
        <title-name title="调拨流程信息"></title-name>
        <custom-form :is-emit="false" :formList="flowFormList" :form="form" editModel="" :formComponents="$refs">
        </custom-form>
      </a-card>
      <slot />
    </a-card>
    <!-- 计量设备调拨表单 -->
    <allocate-form v-if="form.allocateForm" :form="form.allocateForm" :editModel="0" :isToDo="true" />
    <!-- 所属配置计划 -->
    <selectedConfigPlan
        v-if="selectedConfigPlanVisible"
        :visible.sync="selectedConfigPlanVisible"
        :form="form"
        @handelShow="handelShow"
        @handleClick="handleModalClick"
      />
      <div class="tool-btns page-btn-right-top soliciting-opinions-close">
        <a-button type="primary" @click="handleClose">
          关闭
        </a-button>
      </div>
  </div>
</template>

<script>
import equipmentNameManagement from '@/api/quality/equipmentNameManagement' // api
import UploadList from '@/components/UploadList'
import selectedConfigPlan from '@/views/quality/equipmentManagement/projectMeterageEquipmentAccount/components/selectedConfigPlan'
import allocateForm from '@/views/quality/equipmentManagement/meterageEquipmentAllocate/components/allocateForm'
export default {
  components: { selectedConfigPlan, allocateForm },
  props: {
    form: Object,
    confirmFormFormAttr: Object,
  },
  computed: {
    formList() {
      return [
        {
            type: 'a-select',
            keyName: 'mdName',
            label: '设备名称',
            disabled: true
        },
        {
            type: 'a-select',
            keyName: 'specificationModel',
            label: '规格型号',
            disabled: true
        },
        {
            type: 'a-input',
            keyName: 'mdCode',
            label: '设备编号',
            disabled: true
        },
        {
            label: '设备图片',
            keyName: 'ownPicFileList',
            type: UploadList,
            span: 24,
            attrs: {
              businessCode: 'PM44',
              uploadType: 'image',
              isMultiple: true,
              editModel: 0,
              uploadArrys: this.form.ownPicFileList || []
            },
        },
        {
            keyName: 'ownAnnexFileList',
            type: UploadList,
            span: 24,
            label: '附件',
            attrs: {
                businessCode: 'PM44',
                uploadArrys: this.form.ownAnnexFileList || [],
                isShow: false,
                isClose: false
            },
        },
        {
            type: 'a-select',
            keyName: this.confirmFormFormAttr.keyNames.type,
            label: this.confirmFormFormAttr.selectLabel,
            data: this.confirmFormFormAttr.selectData,
            change: () => {
              this.form.projectPlanId = null
              this.form.projectPlanName = null
            }
        },
        {
            type: 'a-date-picker',
            keyName: this.confirmFormFormAttr.keyNames.transferTime,
            label: this.confirmFormFormAttr.timeLabel,
            disabled: true,
            attrs: {
                valueFormat: 'YYYY-MM-DD 00:00:00',
                format: 'YYYY-MM-DD',
            }
        },
        {
            type: 'a-input',
            keyName: 'projectPlanName',
            label: '所属配置计划',
            slot: true,
            hidden: !this.confirmFormFormAttr.key,
        },
        {
            type: 'a-textarea',
            keyName: this.confirmFormFormAttr.keyNames.transferCondition,
            span: 24,
            id: 'test',
            label: this.confirmFormFormAttr.remarksLabel,
        },
      ]
    }
  },
  data() {
    return {
      selectedConfigPlanVisible: false,
      equipmentArr: [],
      specificationModelArr: [],
      flowFormList: [
        {
          keyName: 'transferOutUnitName',
          type: 'a-input',
          label: '调出单位',
          disabled: true
        },
        {
            type: 'a-input',
            keyName: 'detainedDay',
            label: '调出滞留时间',
            disabled: true
        },
        {
            type: 'a-date-picker',
            keyName: 'transferOutTime',
            label: '调出时间',
            disabled: true,
            attrs: {
                valueFormat: 'YYYY-MM-DD 00:00:00',
                format: 'YYYY-MM-DD',
            }
        },
      ]
    }
  },
  async created() {
     this.getEquipmentArr()
  },
  methods: {
    // 当关闭弹窗时，同步selectedConfigPlanVisible的值
    handelShow(e) {
      this.selectedConfigPlanVisible = e
    },
    // 打开所属配置计划弹窗
    chioseBtn() {
      this.form.projectId = this.form.allocateForm.transferInUnit
      this.selectedConfigPlanVisible = true
    },
    // 获取所选中的配置计划
    handleModalClick(e) {
      this.form.projectPlanId = e.projectPlanId
      this.form.projectPlanName = e.mdName
      this.form.configProjectId = e.configProjectId
      this.form.versionId = e.versionId
    },
    // 获取设备数组
    async getEquipmentArr() {
      const params = {
        param: { status: 0 },
        pageNum: 1,
        pageSize: 0
      }
      let res = await equipmentNameManagement.list(params)
      if (res.code === '0') {
          this.equipmentArr = res.data.list || []
      }
    },
    // 获取对应设备的规格型号
    getSpecificationModel(val, record) {
      let row = this.equipmentArr.find(item => item.id === val)
      // 设置规格型号的值
      this.specificationModelArr = row ? row.list : []
    },
    /**
     * @description: 关闭
     * @return {void}
     */
    handleClose() {
      this.$closePage(true)
      // 刷新列表页
      window.postMessage('finish', window.location.origin)
    },
  }
}
</script>

<style>
</style>